<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="include :: head('设置角色')"></head>
<link rel="stylesheet" th:href="@{/layui/extend/dtree/dtree.css}">
<body style="background-color:#fff">
<div class="yadmin-body animated fadeIn">
    <div class="layui-form layui-form-pane">
        <input type="hidden" name="roleId" th:value="${role?.roleId}" />
        <input type="hidden" id="menus" name="menus" th:value="${menuIds}" />
         <div class="layui-form-item">
             <div class="layui-input-inline">
                <input class="layui-input" id="searchInput" value="" placeholder="输入查询节点内容...">
            </div>
            <button class="layui-btn layui-btn-normal" id="search_btn">查询</button>
            <button class="layui-btn layui-btn-normal" dtree-id="menuTree" dtree-menu="moveDown">展开全部</button>
            <button class="layui-btn layui-btn-normal" dtree-id="menuTree" dtree-menu="moveUp">收缩全部</button>
        </div>
        <div class="layui-form-item">
            <ul id="menuTree" class="dtree" data-id="-1" data-value="选择权限"></ul>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block" style="margin-left:0;text-align:center;">
                <button class="layui-btn layui-btn-normal btn-w100" lay-submit="" lay-filter="submit-form">保存</button>
            </div>
        </div>
    </div>
</div>
<script>
layui.extend({
    dtree: 'layui/extend/dtree/dtree'
}).use(['form', 'layer', 'dtree'], function () {
    var form = layui.form, layer = layui.layer, $ = layui.$, dtree = layui.dtree;
    
    dtree.render({
        elem: "#menuTree",
        url: "/menu/tree",
        method: "post",
        checkbar: "true",
        initLevel: 2,
        dataStyle: "layuiStyle",
        dataFormat: "list",
        ficon: ["1", "1"],
        response: {
            statusCode: 0,
            message: "msg",
            title: "name",
            CheckArr: "data"
        },
        menubar: true,
        menubarTips: {
            toolbar: ["moveDown", "moveUp"],
            group: []
        },
        done: function (data, obj, first) {
            if (first) {
                dtree.chooseDataInit("menuTree", $('#menus').val());
                dtree.selectVal("menuTree");
            }
        }
    });
    
    form.on('submit(submit-form)', function (obj) {
        $.ajax({
            type: "POST",
            url: '/role/saveAssign',
            data: obj.field,
            dataType: 'json',
            cache: false,
            success: function (data) {
                let index = parent.layer.getFrameIndex(window.name);
                parent.location.replace(parent.location.href)
                parent.layer.close(index);
            },
            error: function (event) {
                errors(event);
            }
        });
    });
});
</script>
</body>
</html>
